import React, {Component} from "react";
import {Consumer} from '@/Context/myContext.js'

class Son extends Component {
  render() {
    return (<div style={{border: '1px solid red', margin: 100}}>
      <h4>我是子组件</h4>
      {/*
        Consumer组件内部嵌套的是一个函数
        函数的参数为provider组件提供的value值
      */}
      <Consumer>
        {
          // props ==> provider value对应的值
          props => {
            return <>
              <h1>{props.msg}</h1>
              <button
                onClick={props.changeMsg('我是grand father')}
              >
                修改数据
              </button>
            </>
          }
        }
      </Consumer>
    </div>);
  }
}

export default Son
